import {
  ProForm,
  ProCard,
  ProFormRadio,
  ProFormText,
  ProFormTextArea
} from "@ant-design/pro-components";
import { useRef } from 'react';
import { VenueStatus } from '@/enum/venue';
import SvgEditor from "@/components/SvgDraw";
import styles from './styles.module.less';

const BasicForm = () => {
  const ref = useRef<HTMLDivElement>(null);

  return (
    <ProForm
      layout="vertical"
      submitter={false}
      className={styles.form_container}
    >
      <div className={styles.basic}>
        <ProCard>
          <ProFormText
            required
            name="name"
            label="厅名称"
          />
          <ProFormRadio.Group
            required
            name="status"
            label="厅状态"
            valueEnum={VenueStatus}
          />
          <ProFormTextArea
            required
            label="厅描述"
            name="description"
          />
        </ProCard>
      </div>
      <div className={styles.svg_editor}>
        <SvgEditor />
      </div>
    </ProForm>
  );
}

export default BasicForm;